<!DOCTYPE HTML>
<head>
	<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
	<link href="images/favicon.ico" rel="shortcut icon">
	<link rel="stylesheet" type="text/css" media="screen" href="css/960.css" />
	<link rel="stylesheet" type="text/css" media="screen" href="css/text.css" />
	<link rel="stylesheet" type="text/css" media="screen" href="css/reset.css" />
	<link rel="stylesheet" type="text/css" media="screen" href="css/default.css" />
	<link rel="stylesheet" type="text/css" media="screen" href="css/home.css" />
	<title>sikl.us! url shortener</title>
</head>
<body>
<div class="container_12">
	<div id="header" class="grid_12">
		<div id="logo">
			<img src="images/headertext.png" alt="logo">
		</div>
		<div id="nav">
			<ul>
				<li>
				<a class="active" href="#">Home</a>
				</li>
				<li>
				<a href="#">Register</a>
				</li>
				<li id="hiddenfield">
				<form method="post" action="#">
					<input type="text" />
					<input type="submit" value="search"/>
				</form>
				</li>
				<li id="switch">
				<a href="#">Search</a>
				</li>
				<li>
				<a href="#">Login</a>
				</li>
			</ul>
		</div>
	</div>
	<div class="clear"></div>
	<div id="home" class="grid_12">
		<div id="maininput">
			<form>
				<input type="text" name="inputtext"/>
				<input type="submit" value="shorten"/>
			</form>
		</div>
		<div id="social">
			<a href="#"><img src="images/facebook.png" alt="fb icon"/></a>
			<a href="#"><img src="images/facebook.png" alt="fb icon"/></a>
			<a href="#"><img src="images/facebook.png" alt="fb icon"/></a>
			<a href="#"><img src="images/facebook.png" alt="fb icon"/></a>
		</div>
	</div>
	<div class="clear"></div>
	<div id="toptag" class="grid_12">
		<div id="tags">
			<ul>
				<li>
				<a href="#">art</a>
				</li>
				<li>
				<a href="#">blog</a>
				</li>
				<li>
				<a href="#">css</a>
				</li>
				<li>
				<a class="active" href="#">design</a>
				</li>
				<li>
				<a href="#">art</a>
				</li>
				<li>
				<a href="#">blog</a>
				</li>
				<li>
				<a href="#">css</a>
				</li>
				<li>
				<a href="#">design</a>
				</li>
				<li>
				<a href="#">video</a>
				</li>
				<li>
				<a href="#">jquery</a>
				</li>
				<li>
				<a href="#">avenged</a>
				</li>
				<li>
				<a href="#">timnas</a>
				</li>
			</ul>
		</div>
		<div id="more">
			<a href="#">more→</a>
		</div>
	</div>
	<div class="clear"></div>
	<div id="poplat" class="tab grid_12">
		<ul>
			<li>
			<a href="#" class="active">Popular</a>
			</li>
			<li>
			<a href="#" >Latest</a>
			</li>
		</ul>
	</div>
	<div class="clear"></div>
	<div class="thumb grid_3">
		<div class="shadow title">
			<a href="#"> <img class="imgthumb" src="images/thumb1.png" alt="thumb1"/> </a>
			<div class="info">
				<a class="black" href="#"> <h1>this is madness</h1> </a>
				<ul>
					<li>
					<a class="tags" href="#">satu</a>
					</li>
					<li>
					<a class="tags" href="#">dua</a>
					</li>
					<li>
					<a class="tags" href="#">sepuluh</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="arrow"></div>
		<div class="prop">
			<div class="prop-icon">
				<ul class="nonhover">
					<li><a class="icon siklus" href="#">100</a></li>
					<li><a class="icon comment " href="#">20</a></li>
					<li><a class="icon like " href="#">3</a></li>
					<li><a class="icon hate " href="#">9k</a></li>
				</ul>
			</div>
		</div>
	</div>
	<div class="thumb grid_3">
		<div class="shadow title">
			<img class="imgthumb" src="images/thumb1.png" alt="thumb1"/>
			<div class="info">
				<a href="#"> <h1>this is madness</h1> </a>
				<ul>
					<li>
					<a class="tags" href="#">satu</a>
					</li>
					<li>
					<a class="tags" href="#">dua</a>
					</li>
					<li>
					<a class="tags" href="#">sepuluh</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="arrow"></div>
		<div class="prop">
			<div class="prop-icon">
				<a href="#"><img src="images/profile18.png" alt="profile"/> Yusufumar</a>
				<ul>
					<li> <a class="icon left" href="#">repo</a> </li>
					<li> <a class="icon center" href="#">sha</a></li>
					<li> <a class="icon right" href="#">boo</a>  </li> 
				</ul>
			</div>
		</div>
	</div>
	<div class="thumb grid_3">
		<div class="shadow title">
			<img class="imgthumb" src="images/thumb1.png" alt="thumb1"/>
			<div class="info">
				<a href="#"> <h1>this is another crazy madness</h1> </a>
				<ul>
					<li>
					<a class="tags" href="#">satu</a>
					</li>
					<li>
					<a class="tags" href="#">dua</a>
					</li>
					<li>
					<a class="tags" href="#">sepuluh</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="arrow"></div>
		<div class="prop">
			<div class="prop-icon">
				<a href="#"><img src="images/profile18.png" alt="profile"/> Yusufumar</a>
				<a class="icon left" href="#">repo</a>
				<a class="icon center" href="#">sha</a>
				<a class="icon right" href="#">boo</a>
			</div>
		</div>
	</div>
	<div class="thumb grid_3">
		<div class="shadow title">
			<img class="imgthumb" src="images/thumb1.png" alt="thumb1"/>
			<div class="info">
				<a href="#"> <h1>this is madness</h1> </a>
				<ul>
					<li>
					<a class="tags" href="#">satu</a>
					</li>
					<li>
					<a class="tags" href="#">dua</a>
					</li>
					<li>
					<a class="tags" href="#">sepuluh</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="arrow"></div>
		<div class="prop">
			<div class="prop-icon">
				<a href="#"><img src="images/profile18.png" alt="profile"/> Yusufumar</a>
				<a class="icon left" href="#">repo</a>
				<a class="icon center" href="#">sha</a>
				<a class="icon right" href="#">boo</a>
			</div>
		</div>
	</div>
	<div class="clear"></div>
	<div id="footer" class="grid_12">
		<ul>
			<li>
			<a href="#">Copyright©2011 Siklus </a>
			</li>
			<li>
			<a href="#">About Us </a>
			</li>
			<li>
			<a href="#">Contact </a>
			</li>
			<li>
			<a href="#">Report Abuse </a>
			</li>
			<li>
			<a href="#">Term & Privacy</a>
			</li>
		</ul>
	</div>
	<script type="text/javascript" src="./js/jquery-1.6.2.js"></script>
	<script type="text/javascript" src="js/latihan.js"></script>
</body>
